<template>
	<view class="index">
        <view class="top"></view>
        <Header></Header>
        <Swiper></Swiper>
        <Menu></Menu>
        <view class="line"/>
        <Featured></Featured>
        <view class="line"/>
        <Food></Food>
        <view class="line"/>
        <Beauty></Beauty>
        <view class="line"/>
        <Miju></Miju>
        <view class="line"/>
        <Play/>
	</view>
</template>

<script>
    import Header from './components/Header.vue'
    import Swiper from './components/Swiper.vue'
    import Menu from './components/Menu.vue'
    import Featured from './components/Featured.vue'
    import Food from './components/Food.vue'
    import Beauty from './components/Beauty.vue'
    import Miju from './components/Miju.vue'
    import Play from './components/Play.vue'
	export default {
        components:{
            Header,
            Swiper,
            Menu,
            Featured,
            Food,
            Beauty,
            Miju,
            Play
        }
	}
</script>

<style>
    .line{
        height: 10px;
        background-color: #f8f8f8;
    }
    .top{
        height: 30px;
        background-color: rgb(248, 248, 248); color: rgb(0, 0, 0);
    }
</style>
